import styled from 'styled-components'

export const SearchDiv = styled.div`
.search-bar {
  height: 0.46rem;
  background: rgb(247, 247, 247);
  display: flex;
  padding: 0.07rem 0.15rem 0.07rem 0.09rem;
  justify-content: space-between;
  align-items: center;

  .search {
    input {
      display: block;
      box-sizing: border-box;
      width: 3.1rem;
      height: 0.32rem;
      padding-left: 0.22rem;
      background: #EAEAEA url('//sh1.hoopchina.com.cn/fis_static/shihuomobile/static/homefis/widget/header/search_0b8e800.png') 0.04rem center no-repeat; 
      background-size: 0.14rem;
      font-size: 0.11rem;
      border: 1px solid #EAEAEA;
      border-radius: 0.03rem;

      &:focus {
        outline: none;
        border: 1px solid #be9857;
      }
    }
  }

  .cancel {
    span {
      display: flex;
      font-size: 0.12rem;
      color: #666;
      padding: 0.1rem 0;
    }
  }
}

.inner {
  padding: 0.1rem;

  p {
    height: 0.4rem;
    line-height: 0.4rem;
    color: #999;
  }

  .hot {
    li {
      font-size: 0.12rem;
      display: inline-block;
      margin-right: 0.05rem;
      margin-bottom: 0.1rem;
      border: 1px solid #aeaeae;
      color: #444;
      padding: 0.08rem 0.05rem;
      border-radius: 0.03rem;
    }
  }

  .history {
    li {
      display: flex;
      justify-content: space-between;
      align-items: center;
      border_1px(0 0 1px 0, #e6e6e6);

      span {
        font-size: 0.16rem;
        display: inline-block;
        height: 0.42rem;
        line-height: 0.42rem;
        padding-right: 2.5rem;
      }

      i {
        display: inline-block;
        width: 0.1rem;
        height: 0.1rem;
        background: url('//sh1.hoopchina.com.cn/fis_static/shihuomobile/static/homefis/delete_a43fdc1.png') center no-repeat; 
        background-size: 0.1rem;
      }
    }
  }

  .clear_history {
    margin-top: 0.1rem;
    height: 0.42rem;

    p {
      margin: 0 auto;
      box-sizing: border-box;
      width: 2rem;
      text-align: center;
      font-size: 0.13rem;
      color: #FF4338;
      border-radius: 0.04rem;
      height: 0.42rem;
      line-height: 0.42rem;
      text-align: center;
      border_1px(1px, #ECECEC);
      background: #fff;
    }
  }
}
`